<template>
  <view>
     <u-tabs :list="list1" @click="tabCourse" lineColor="transparent" :activeStyle ="{ color: '#f00' }" :inactiveStyle="{color: '#ccc'}"></u-tabs>
     <view class="context" >
       <view class="info" v-for="(item,index) in courseList" :key="item.id">
         {{item.courseName}}
       </view>
     </view>
  </view>
</template>

<script>
  import { recommendCourse,mostHeatCourse } from '@/api/course.js'
  export default {
    data() {
      return {
          list1: [{
              name: '综合推荐',
          }, {
              name: '最新',
          }, {
              name: '浏览最多'
          }],
          courseList:[],
          paramsCourseDara:{
            pageNum:1,
            pageSize:10,
            entity:{
              isFree:1
            }
          }
      };
    },
    mounted() {
      this.tabCourse()
    },
    methods:{
        // 获取
      tabCourse(e) {
          // 
        if(e) {
          if(e.index == 1) {
            this.paramsCourseDara.entity =  {isFree:1,sortBy:'time-desc'}
          }else if(e.index == 2){
            this.paramsCourseDara.entity =  {isFree:1,sortBy:'clicks-desc'}
          }else {
             this.paramsCourseDara.entity =  {isFree:1}
          }
          this.getCourseList(this.paramsCourseDara)
        }else {
          console.log(this.paramsCourseDara);
          this.getCourseList(this.paramsCourseDara)
        }
      },
      // 请求接口
      async getCourseList(paramsCourseDara) {
        const {data} = await recommendCourse(paramsCourseDara)
        this.courseList = data.pageInfo.list
      }
    }
  }
</script>

<style lang="scss">

</style>
